<template>
    <div class="count">
        <h3>当前求和：{{ countStore.sum }}</h3>
        <select v-model.number="countStore.num">
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
        </select>
        <button @click="countStore.add">加</button>
        <button @click="countStore.minus">减</button>
    </div>
</template>

<script lang="ts" setup name="Count">
import useSum from '@/hooks/useSum';
import { useCountStore } from '@/store/Count';

// const {sum, num, add, minus} = useCountStore()
const countStore = useCountStore()

</script>

<style>
.count {
    background-color: skyblue;
    box-shadow: 0 0 10px;
    border-radius: 10px;
    padding: 20px;
}
select,button {
    height: 25px;
    margin: 0 10px;
}
</style>